'use client'

import Image from 'next/image'
import { Button } from 'antd'
import UserAuthFromIcon from './UserAuthFromIcon'
import { useUser } from '@clerk/nextjs'

export default function OwnerAvatar() {
  const { user } = useUser()

  // const ownerAvatar = useAggregationSelector((s) => s?.avatar)!;

  return (
    <Button
      type="text"
      onClick={() => {
        window.open('/dashboard', '_blank')
      }}
      className="pointer-events-auto relative flex items-center bg-white justify-center"
    >
      <span className="sr-only">Go to dashboard</span>
      <Image
        className="rounded-full"
        height={30}
        width={30}
        src={user?.imageUrl as string}
        alt="site owner"
      />
      <UserAuthFromIcon className="absolute -bottom-1 -right-1" />
    </Button>
  )
}
